<div class="appDiv">
	<h1>hello world</h1>
	<hr>
	
	<!--{{}}-->
	<div>userName:{{userName}}</div>
	<hr>
	
	<!--nfIf-->
	<div>
		<button (click)="btnShowTest()">{{showTest ? "Hide" : "Show"}}</button>
		<span *ngIf="showTest">click button to hide me!</span>
	</div>
	<hr>
	
	<!--ngFor-->
	<div>
		<p>item of list:</p>
		<ul>
			<li *ngFor="#item of list; #i = index">{{i}}:{{item}}</li>
		</ul>
	</div>
	<hr>
	
	<!--ngSwitch-->
	<!--<div [ngSwitch]="'10'">
        <template [ngSwitchWhen]="'10'">ngSwitchWhen 10</template>
        <template [ngSwitchWhen]="'20'">ngSwitchWhen 20</template>
        <template ngSwitchDefault>ngSwitchDefault 00</template>
	</div>
	<hr>-->
	
	<!--ngStyle-->
	<!--<div [ngStyle]="{'font-style': 'italic', 'font-size': '20px', 'font-weight': 'bold'}">style of this text</div>
	<hr>-->
	
	<!--ngClass-->
	<!--<div [ngClass]="{active: isOn, disabled: isDisabled}">ngClss test</div>
	<hr>-->
	
	<!--form-->
	<!--<input [(ngModel)]="userName">
	<hr>
	
	<form #f="ngForm" (submit)='onSubmit(f.value)'>
		Login <input type='text' ngControl='login' #l="ngForm">
		<div *ngIf="!l.valid">Login is invalid</div>
		<div *ngIf="l.valid">Login is valid</div>
		Password <input type='password' ngControl='password'>
		<button type='submit'>Log in!</button>
	</form>
	
	<form #f="ngForm" (ngSubmit)="onSubmit(f)">
		<h3>Control group: credentials</h3>
		<div ngControlGroup="credentials">
			<p>Login: <input type="text" ngControl="login"></p>
			<p>Password: <input type="password" ngControl="password"></p>
		</div>
		<h3>Control group: person</h3>
		<div ngControlGroup="person">
			<p>First name: <input type="text" ngControl="firstName"></p>
			<p>Last name: <input type="text" ngControl="lastName"></p>
		</div>
		<button type="submit">Submit Form</button>
	</form>-->
</div>